<template>
  <!-- 新增窗口 -->
  <a-modal v-model:visible="visible" title="添加员工" @ok="execAdd">
    <a-form
      :model="addObj"
      :label-col="{ span: 5 }"
      :wrapper-col="{ span: 14 }"
    >
      <a-form-item label="员工号">
        <a-input v-model:value="addObj.st_id" />
      </a-form-item>
      <a-form-item label="姓名">
        <a-input v-model:value="addObj.st_name" />
      </a-form-item>
      <a-form-item label="性别">
        <a-radio-group v-model:value="addObj.st_sex">
          <a-radio :value="true">男</a-radio>
          <a-radio :value="false">女</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item label="出生日期">
        <a-date-picker v-model:value="addObj.st_birth" />
      </a-form-item>
      <a-form-item label="职位">
        <div>
          <a-radio-group
            size="small"
            v-model:value="addObj.ro_id"
            button-style="solid"
          >
            <a-radio-button value="1200">销售管理员</a-radio-button>
            <a-radio-button value="1300">库存管理员</a-radio-button>
            <a-radio-button value="1400">收银员</a-radio-button>
          </a-radio-group>
        </div>
      </a-form-item>
      <a-form-item label="月薪">
        <a-input v-model:value="addObj.st_salary" />
      </a-form-item>
      <a-form-item label="电话">
        <a-input v-model:value="addObj.st_tel" />
      </a-form-item>
      <a-form-item label="住址">
        <a-input v-model:value="addObj.st_address" />
      </a-form-item>
      <a-form-item label="备注">
        <a-textarea v-model:value="addObj.st_remark" :rows="3" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
import { ref, reactive } from "vue";
import { post, tip } from "@/common";

export default {
  // emit是一个函数，用于子组件向父组件发射事件
  setup(props, { emit }) {
    //新增
    const addObj = reactive({
      st_id: "",
      st_name: "",
      st_sex: "",
      st_birth: "",
      st_tel: "",
      st_address: "",
      st_state: "true",
      st_remark: "",
      ro_id: "",
      st_salary: "",
    });
    const visible = ref(false);
    const openAdd = () => {
      //打开窗口
      visible.value = true;
    };
    const execAdd = () => {
      //执行新增
      post("/branch/staff", addObj).then((res) => {
        addObj.st_id = "";
        addObj.st_name = "";
        addObj.ro_id = "";
        addObj.st_sex = "";
        addObj.st_birth = "";
        addObj.st_tel = "";
        addObj.st_address = "";
        addObj.st_remark = "";
        addObj.st_salary = "";
        visible.value = false;
        tip.success("添加员工成功！");
        //通知父组件执行更新页面的方法
        emit("ok"); //向父组件发射一个名称为ok的事件，此事件表示新增完成
      });
    };

    return {
      //声明数据和方法
      addObj,
      visible,
      openAdd,
      execAdd,
    };
  },
};
</script>

<style scoped>
</style>